<template>
  <el-container class="main_con">
    <div class="filter_con ds_block">
      <div class="filter_con ds_block">
        <div class="filter_area">
          <el-input size="medium" v-model="params.name" class="serach_input mr_15 mt_15" placeholder="活动名称"></el-input>
          <el-select v-model="params.status" placeholder="请选择" class="serach_input mr_15 mt_15" clearable>
            <el-option v-for="item in statuslist" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
          <el-button size="medium" @click="getlist">搜索</el-button>
        </div>
      </div>
    </div>
    <div class="list_con">
      <el-table :data="list" element-loading-text fit highlight-current-row class="main-loading">
        <el-table-column prop="agent" label="分销商">
          <template slot-scope="scope">
            <span>{{ scope.row.agent.name }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="g_name" label="分销商等级"></el-table-column>
        <el-table-column prop="ip" label="活动名称">
          <template slot-scope="scope">
            <span>{{ scope.row.activity ? scope.row.activity.name : '' }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="ip" label="奖励内容">
          <template slot-scope="scope">
            <div>
              <span style="margin-right: 10px;" v-if="scope.row.content.integral">积分:{{ scope.row.content.integral }},</span>
              <span style="margin-right: 10px;" v-if="scope.row.content.balance">余额:{{ scope.row.content.balance }},</span>
              <span style="margin-right: 10px;" v-if="scope.row.content.upgrade">升级至下一个分销等级</span>
            </div>
            <div v-if="scope.row.content.coupons && scope.row.content.coupons.length > 0">
              优惠券：
              <span v-for="(coupon, i) in scope.row.content.coupons">{{ coupon.name }}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="奖励时间" prop="create_time"></el-table-column>
        <el-table-column label="发放状态" prop="create_time">
          <template slot-scope="scope">
            <span>{{ scope.row.status | statustext }}</span>
          </template>
        </el-table-column>

        <el-table-column label="操作" prop="create_time">
          <template slot-scope="scope">
            <el-button v-has v-if="scope.row.status == 0" type="text" @click="SendHandle(scope.row.id)">发放奖励(单人)</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="table_footer">
        <el-pagination
          @current-change="ChangeCurrent"
          class="pages"
          background
          layout="prev, pager, next"
          :total="total"
          :page-size="params.size"
          :page-count="params.page"
          hide-on-single-page
        ></el-pagination>
      </div>
    </div>
  </el-container>
</template>

<script>
import {getawardlist, activityissue} from '@/api/mall/commission';
import {fitter_keyword} from '@/utils/index';
import {agent_gradelist} from '@/api/mall/agent';
export default {
  data() {
    return {
      params: {
        status: '',
        page: 1,
        size: 10,
        name: '',
        create_time: ''
      },
      total: 0,
      listLoading: true,
      list: [],
      gradelist: [],
      statuslist: [
        {
          value: 0,
          label: '未开始'
        },
        {
          value: 1,
          label: '开启'
        },
        {
          value: 2,
          label: '暂停'
        },
        {
          value: 3,
          label: '结束'
        },
        {
          value: 4,
          label: '关闭'
        }
      ]
    };
  },
  filters: {
    statustext(status) {
      switch (status) {
        case 0:
          return '未发放';
          break;
        case 1:
          return '已发放';
          break;
        case 2:
          return '已失效';
          break;
      }
    }
  },
  mounted() {
    this.agent_gradelist();
  },

  methods: {
    agent_gradelist() {
      let data = {
        page: 1,
        size: 10
      };
      agent_gradelist(data).then(res => {
        let list = res.msg;
        list.unshift({id: 0, name: '默认等级'});
        this.gradelist = list;
        this.getlist();
      });
    },
    //获取列表
    getlist() {
      this.listLoading = true;
      let data = fitter_keyword(this.params);
      getawardlist(data).then(res => {
        var jsondata = res.msg;
        let list = jsondata.data;
        list.forEach(a => {
          let g_name = this.gradelist.filter(_ => a.level_id == _.id);
          if (g_name.length > 0) {
            a.g_name = g_name[0].name;
          }
        });
        this.list = list;
        this.total = jsondata.total;
        // this.list = response.data.items
        this.listLoading = false;
      });
    },

    //切换页码
    ChangeCurrent(page) {
      this.params.page = page;
      this.getlist();
    },
    SendHandle(id) {
      let _this = this;
      this.$confirm('确认对该分销商发送奖励？')
        .then(_ => {
          let data = {
            id: id
          };
          activityissue(data).then(res => {
            _this.getlist();
          });
        })
        .catch(_ => {});
    }
  }
};
</script>

<style lang="scss" scoped></style>
